<template>
    <a-modal
            :visible.sync="showMechanicalCharacteristicsDetail"
            @cancel="closeMechanicalCharacteristicsDetail"
            title="详情"
            cancelText="关闭"
            :width="modalWidth"
            destroyOnClose
            :confirmLoading="confirmLoading"
            :bodyStyle="tstyle">
        <template slot="footer">
            <a-button key="取消" @click="closeMechanicalCharacteristicsDetail">关闭</a-button>
        </template>
        <a-card :title='"供应商工单编号："+ supplierWorkNo' :bordered="true">
            <a-row :span="24">
                <a-col :span="8">
                    采购方总部编码：{{ dataSourceDetail.purchaserHqCode }}
                </a-col>
                <a-col :span="8">
                    供应商编码：{{ dataSourceDetail.supplierCode }}
                </a-col>
                <a-col :span="8">
                    供应商名称：{{ dataSourceDetail.supplierName }}
                </a-col>
            </a-row>
            <a-row :span="24" style="margin-top: 10px;">
                <a-col :span="8">
                    供应商工单编号：{{ dataSourceDetail.supplierWorkNo }}
                </a-col>
                <a-col :span="8">
                    采集规范版本号：{{ dataSourceDetail.standardVersion }}
                </a-col>
                <a-col :span="8">
                    规格型号编码：{{ dataSourceDetail.modelCode }}
                </a-col>
            </a-row>
            <a-row :span="24" style="margin-top: 10px;">
                <a-col :span="8">
                    物资品类类型：{{ dataSourceDetail.categoryType }}
                </a-col>
                <a-col :span="8">
                    厂区编号：{{ dataSourceDetail.factoryCode }}
                </a-col>
                <a-col :span="8">
                    供应商数据编号：{{ dataSourceDetail.supplierSupportId }}
                </a-col>
            </a-row>
            <a-row :span="24" style="margin-top: 10px;">
                <a-col :span="8">
                    供应商产品场内编码：{{ dataSourceDetail.productModel }}
                </a-col>
                <a-col :span="8">
                    生产设备名称：{{ dataSourceDetail.equipmentName }}
                </a-col>
                <a-col :span="8">
                    生产设备唯一识别号：{{ dataSourceDetail.equipmentUniqueCode }}
                </a-col>
            </a-row>
            <a-row :span="24" style="margin-top: 10px;">
                <a-col :span="8">
                    感知过程：{{ dataSourceDetail.processType }}
                </a-col>
                <a-col :span="8">
                    速度（副闸）：{{ dataSourceDetail.speedDeputy }}
                </a-col>
                <a-col :span="8">
                    速度（合闸）：{{ dataSourceDetail.speedClose }}
                </a-col>
            </a-row>
            <a-row :span="24" style="margin-top: 10px;">
                <a-col :span="8">
                    速度（主闸）：{{ dataSourceDetail.speedMain }}
                </a-col>
                <a-col :span="8">
                    时间（主闸）_A：{{ dataSourceDetail.masteropentimeA }}
                </a-col>
                <a-col :span="8">
                    时间（主闸）_B：{{ dataSourceDetail.masteropentimeB }}
                </a-col>
            </a-row>
            <a-row :span="24" style="margin-top: 10px;">
                <a-col :span="8">
                    时间（主闸）_C：{{ dataSourceDetail.masteropentimeC }}
                </a-col>
                <a-col :span="8">
                    时间（副闸）_A：{{ dataSourceDetail.salveopentimeA }}
                </a-col>
                <a-col :span="8">
                    时间（副闸）_B：{{ dataSourceDetail.salveopentimeB }}
                </a-col>
            </a-row>
            <a-row :span="24" style="margin-top: 10px;">
                <a-col :span="8">
                    时间（副闸）_C：{{ dataSourceDetail.salveopentimeC }}
                </a-col>
                <a-col :span="8">
                    时间（合闸）_A：{{ dataSourceDetail.clonetimeA }}
                </a-col>
                <a-col :span="8">
                    时间（合闸）_B：{{ dataSourceDetail.clonetimeB }}
                </a-col>
            </a-row>
            <a-row :span="24" style="margin-top: 10px;">
                <a-col :span="8">
                    时间（合闸）_C：{{ dataSourceDetail.clonetimeC }}
                </a-col>
                <a-col :span="8">
                    行程：{{ dataSourceDetail.route }}
                </a-col>
                <a-col :span="8">
                    <span>行程图片A：</span>
                    <a style="color: deepskyblue" @click="showModal('A')">
                        查看
                    </a>
                    <a-modal v-model="visibleA" title="行程图片A" :footer="null">
                        <img :src="this.imgurl + dataSourceDetail.routePictureAObj" alt="" width="100%" height="100%">
                    </a-modal>
                </a-col>
            </a-row>
            <a-row :span="24" style="margin-top: 10px;">
                <a-col :span="8">
                    <span>行程图片B：</span>
                    <a style="color: deepskyblue" @click="showModal('B')">
                        查看
                    </a>
                    <a-modal v-model="visibleB" title="行程图片B" :footer="null">
                        <img :src="this.imgurl +dataSourceDetail.routePictureBObj " alt="" width="100%" height="100%">
                    </a-modal>
                </a-col>
                <a-col :span="8">
                    <span>行程图片C：</span>
                    <a style="color: deepskyblue" @click="showModal('C')">
                        查看
                    </a>
                    <a-modal v-model="visibleC" title="行程图片C" :footer="null">
                        <img :src="this.imgurl +dataSourceDetail.routePictureCObj " alt="" width="100%" height="100%">
                    </a-modal>
                </a-col>
                <a-col :span="8">
                    波形数据：{{ dataSourceDetail.waveform }}
                </a-col>
            </a-row>
            <a-row :span="24" style="margin-top: 10px;">
                <a-col :span="8">
                    采集时间：{{ dataSourceDetail.checkTime }}
                </a-col>
                <a-col :span="8">
                    工序：{{ dataSourceDetail.pdCode }}
                </a-col>
            </a-row>

        </a-card>
    </a-modal>
</template>

<script>
    import ImagPreview from '../../../../jeecg/ImagPreview'

    export default {
        name: 'JxtxDetail',
        components: {ImagPreview},
        props: {
            dataSourceDetail: {
                type: Object,
                default: false
            }
        }, data() {
            //详细信息表头
            return {
                visibleA: false,                 //图片弹出框
                visibleB: false,
                visibleC: false,
                showMechanicalCharacteristicsDetail: true,       //详情页面
                supplierWorkNo: '',                              //工单号
                modalWidth: '70%',
                tstyle: {
                    'height': '450px',
                    'overflow': 'auto'
                },
                loading: false,
                confirmLoading: false,
                // imgurl: 'http://10.0.4.201:8082/jeecg-boot/eipMechanicalCharacteristics/getRouterPicture?loid='
                // imgurl: 'http://10.0.4.201/jeecg-boot/eipMechanicalCharacteristics/getRouterPicture?loid='
                imgurl: 'https://8.8.12.13/jeecg-boot/eipMechanicalCharacteristics/getRouterPicture?loid='
            }
        }
        ,
        methods: {
            closeMechanicalCharacteristicsDetail() {//详细信息是否关闭
                this.$emit('close')
            },
            loadData() {
                let mechanicalCharacteristics = this.dataSourceDetail
                this.supplierWorkNo = mechanicalCharacteristics.supplierWorkNo
            },
            showModal(param) {
                if (param === 'A') {
                    this.visibleA = true
                }
                if (param === 'B') {
                    this.visibleB = true
                }
                if (param === 'C') {
                    this.visibleC = true
                }
            }
        }, created() {
            this.loadData()
        }
    }
</script>
